<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
    #shade{
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,0.4);
    }
        ._div{
            margin-bottom: 10px;
        }
    </style>
</head>
<link rel="stylesheet" th:href="@{/lay/lib/layui-v2.5.5/css/layui.css}" media="all">
<link rel="stylesheet" th:href="@{/lay/css/public.css}" media="all">
<body>
<div id="shade">
    <div class="layui-upload layui-form" style="width: 510px; background-color: white; margin: 20px auto">
        <div class="_div">
            <div class="layui-inline _div">
                <label class="layui-form-label">任务名称</label>
                <div class="layui-input-inline">
                    <input type="tel" name="eventName" style="width: 370px;" lay-verify="required|title" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-inline _div">
                <label class="layui-form-label">任务内容</label>
                <div class="layui-input-inline">
                <textarea type="tel" style="width: 370px;height: 100px" name="eventMess" lay-verify="required|mess" autocomplete="off"
                          class="layui-input"></textarea>
                </div>
            </div>
            <div class="layui-inline _div">
                <label class="layui-form-label">任务备注</label>
                <div class="layui-input-inline">
                <textarea type="tel" style="width: 370px;height: 50px" name="eveRemark"  autocomplete="off"
                          class="layui-input"></textarea>
                </div>
            </div>
        </div>
        <div class="_div">
            <div class="layui-inline">
                <label class="layui-form-label">任务积分</label>
                <div class="layui-input-inline">
                    <input type="number"  min="1" name="eventScore" lay-verify="required" autocomplete="off" class="layui-input">
                </div>
            </div>
            <button style="margin-left: 20px" type="button" class="layui-btn layui-btn-normal" id="submit">保存</button>
        </div>

    </div>
</div>
<script th:src="@{/lay/lib/layui-v2.5.5/layui.js}" charset="utf-8"></script>

<script>

    layui.use(['upload', 'form'], function () {
        var $ = layui.jquery
            , upload = layui.upload;
        //普通图片上传
        let uploadInst = upload.render({
            elem: '#selectImg',
            auto: false,
            bindAction: '#submit', // 指定可以上传的按钮
            // ,url: 'https://httpbin.org/post' //改成您自己的上传接口
            choose: function (obj) {
                $("#carousel_img_container").show()
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                    $('#carousel_img').attr('src', result); //图片链接（base64）
                });
            }
            , done: function (res) {
                //如果上传失败
                if (res.code > 0) {
                    return layer.msg('上传失败');
                }
                //上传成功
            },

        });
        //    layui.use 结束位置
    });
</script>
</body>
</html>